import { Component } from '@angular/core';
import { IonicPage, MenuController, NavController, Platform } from 'ionic-angular';

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

export interface Slide {
  title: string;
  image: string;
}

@IonicPage()
@Component({
  selector: 'page-tutorial',
  templateUrl: 'tutorial.html'
})
export class TutorialPage {
  slides: Slide[];
  showSkip = true;

  constructor(public navCtrl: NavController, public menu: MenuController, private statusBar: StatusBar, 
    private splashScreen: SplashScreen, private platform: Platform ) {
	  this.slides = [
	    {
	      title: '',
	      image: 'assets/img/ica-slidebox-img-1.png'
	    },
	    {
	      title: '',
	      image: 'assets/img/ica-slidebox-img-2.png'
	    },
	    {
	      title: '',
	      image: 'assets/img/ica-slidebox-img-3.png'
	    }
	  ];
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad TutorialPage');
    this.platform.ready().then(() => {
      console.log('platform ready');
      this.statusBar.styleLightContent();  
      this.splashScreen.hide();
    });
  }
  
  startApp() {
    this.navCtrl.setRoot('IndexPage', {}, {
      animate: true,
      direction: 'forward'
    });
  }

  onSlideChangeStart(slider) {
    this.showSkip = !slider.isEnd();
  }

  ionViewDidEnter() {
    // the root left menu should be disabled on the tutorial page
    this.menu.enable(false);
  }

  ionViewWillLeave() {
    // enable the root left menu when leaving the tutorial page
    this.menu.enable(true);
  }

}
